<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="stylesheet" href="./../bootstrap/css/bootstrap.css">
  <style>
    .userphoto,
    .userphoto_3 {
      width: 100px;
      height: 100px;
    }

    #myPage,
    #myPage2 {
      display: none;
    }
  </style>
</head>

<body>
  <div class="container">
    <div class="row">

      <div class="col">
        <h1 class="header">医生管理：</h1>
        <div class="my-5" class="row">
          <div class="col py-3">
            <form class="form-inline">
              <div class="input-group mb-2 mr-sm-2">
                <button class="btn btn-success form-control" type="button" id="addJobBtn">添加医生</button>
              </div>

              <label class="sr-only" for="dname">医生姓名:</label>
              <input type="text" class="form-control mb-2 mr-sm-2" id="dname" placeholder="请输入医生姓名">

              <label class="sr-only" for="jname">职称：</label>
              <div class="input-group mb-2 mr-sm-2">
                <select name="jname" class="form-control" id="jname">
                  <option value="1">医生</option>
                  <option value="2">主治医生</option>
                </select>
              </div>
              <label class="sr-only" for="dsex">职称：</label>
              <div class="input-group mb-2 mr-sm-2">
                <select name="dsex" class="form-control" id="dsex">
                  <option value="0" disabled selected>请选择性别</option>
                  <option value="男">男</option>
                  <option value="女">女</option>
                </select>
              </div>
              <div class="input-group mb-2 mr-sm-2">
                <button class="btn btn-primary form-control" type="button" id="searchBtn">查询</button>
              </div>

            </form>
          </div>
        </div>
        <div>
          <table class="table table-hover table-bordered">
            <thead>
              <tr>
                <th>序号</th>
                <th>医生姓名</th>
                <th>职称名称</th>
                <th>性别</th>
                <th>身份证</th>
                <th>电话</th>
                <th>特长</th>
                <th>操作</th>
              </tr>
            </thead>
            <tbody id="doctorTable">
              <tr>
                <td>序号</td>
                <td>医生姓名</td>
                <td>主治医生</td>
                <td>性别</td>
                <td>身份证</td>
                <td>电话</td>
                <td>特长</td>
                <td>操作</td>
              </tr>

            </tbody>
          </table>
        </div>
        <!-- 分页 -->
        <div id="myPage">
          <nav>
            <ul class="pagination pagination-sm">
              <li class="page-item active" aria-current="page">
                <span class="page-link">1</span>
              </li>
              <li class="page-item"><a class="page-link" href="#">2</a></li>
              <li class="page-item"><a class="page-link" href="#">3</a></li>
            </ul>
            <!--   <select name="page" id="page"> -->
            <!-- <option value="5">5</option> -->
            <!-- </select> -->
          </nav>
        </div>
        <!--  搜索的分页 -->
        <div id="myPage2">
          <nav>
            <ul class="pagination pagination-sm">
              <!-- <li class="page-item active" aria-current="page">
                <span class="page-link">1</span>
              </li>
              <li class="page-item"><a class="page-link" href="#">2</a></li>
              <li class="page-item"><a class="page-link" href="#">3</a></li> -->
            </ul>
            <select name="page" id="page2">
              <!-- <option value="5">5</option> -->
            </select>
          </nav>
        </div>
      </div>
    </div>
  </div>
  <!-- 添加 -->
  <div class="modal" tabindex="-1" id="addDoctorModal">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">添加医生</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <form>
            <div class="form-group row">
              <label for="dname2" class="col-sm-2 col-form-label">医生姓名：</label>
              <div class="col-sm-6">
                <input type="text" name="dname2" class="form-control" id="dname2" aria-describedby="emailHelp">
              </div>
              <div class="col-sm-4">
                <small id="dname2help" class="form-text text-muted">请输入20字以内</small>
              </div>
            </div>
            <div class="form-group row">
              <label for="dsid" class="col-sm-2 col-form-label">身份证号码：</label>
              <div class="col-sm-6"> <input type="text" name="dsid" class="form-control" id="dsid"
                  aria-describedby="emailHelp"></div>
              <div class="col-sm-4"><small id="dsidhelp" class="form-text text-muted">请输入18个字符</small></div>
            </div>
            <div class="form-group row">
              <label for="dtel" class="col-sm-2 col-form-label">电话号码：</label>
              <div class="col-sm-6"> <input type="text" name="dtel" class="form-control" id="dtel"
                  aria-describedby="emailHelp"></div>
              <div class="col-sm-4"><small id="dtelhelp" class="form-text text-muted">最多11个字符</small></div>
            </div>
            <div class="form-group row">
              <label for="dsex2" class="col-sm-2 col-form-label">性别：</label>
              <div class="col-sm-6">
                <select class="form-control" name="dsex2" id="dsex2">
                  <option value="" disabled selected>请选择</option>
                  <option value="男">男</option>
                  <option value="女">女</option>
                </select>
              </div>
            </div>
            <div class="form-group row">
              <label for="dfeaturs" class="col-sm-2 col-form-label">医生特长：</label>
              <div class="col-sm-6"><textarea row="50" col="5" class="form-control" id="dfeaturs"></textarea></div>
              <div class="col-sm-4"> <small id="dfeaturshelp" class="form-text text-muted">50字以内</small></div>
            </div>
            <div class="form-group row">
              <label for="jid" class="col-sm-2 col-form-label">医生职称：</label>
              <div class="col-sm-6">
                <select class="form-control" name="jname" id="jid">
                  <option value="" disabled selected>请选择</option>
                  <option value="1">住院医生</option>
                </select>
              </div>
            </div>
            <div class="form-group row">
              <label for="dphoto" class="col-sm-2 col-form-label">头像：</label>
              <div class="col-sm-6">
                <input type="file" class="form-control" name="dphoto" id="dphoto" />
              </div>
              <div class="col-sm-4">
                <small id="dphotoshelp" class="form-text text-muted">选择图片，添加头像</small>
              </div>
            </div>
            <div class="form-group row">
              <label for="" class="col-sm-2 col-form-label"></label>
              <div class="col-sm-6">
                <img class="userphoto" src="./../img/userdefault.jpeg" alt="">
              </div>
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">返回</button>
          <button type="button" class="btn btn-primary btn-add">创建</button>
        </div>
      </div>
    </div>
  </div>

  <!-- 修改 -->
  <div class="modal" tabindex="-1" id="addDoctorModal_2">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title">修改医生信息</h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <form name="myform2">
            <input type="hidden" id="did" name="did">
            <div class="form-group row">
              <label for="dname3" class="col-sm-2 col-form-label">医生姓名：</label>
              <div class="col-sm-6">
                <input type="text" name="dname3" class="form-control" id="dname3">
              </div>
              <div class="col-sm-4">
                <small id="dname3help" class="form-text text-muted">请输入20字以内</small>
              </div>
            </div>
            <div class="form-group row">
              <label for="dsid3" class="col-sm-2 col-form-label">身份证号码：</label>
              <div class="col-sm-6"> <input type="text" name="dsid3" class="form-control" id="dsid3"></div>
              <div class="col-sm-4"><small id="dsid3help" class="form-text text-muted">请输入18个字符</small></div>
            </div>
            <div class="form-group row">
              <label for="dtel3" class="col-sm-2 col-form-label">电话号码：</label>
              <div class="col-sm-6"> <input type="text" name="dtel3" class="form-control" id="dtel3"></div>
              <div class="col-sm-4"><small id="dtel3help" class="form-text text-muted">最多11个字符</small></div>
            </div>
            <div class="form-group row">
              <label for="dsex3" class="col-sm-2 col-form-label">性别：</label>
              <div class="col-sm-6">
                <select class="form-control" name="dsex3" id="dsex3">
                  <option value="" disabled selected>请选择</option>
                  <option value="男">男</option>
                  <option value="女">女</option>
                </select>
              </div>
            </div>
            <div class="form-group row">
              <label for="dfeaturs3" class="col-sm-2 col-form-label">医生特长：</label>
              <div class="col-sm-6"><textarea row="50" col="5" class="form-control" id="dfeaturs3"></textarea></div>
              <div class="col-sm-4"> <small id="dfeaturs3help" class="form-text text-muted">50字以内</small></div>
            </div>
            <div class="form-group row">
              <label for="jid3" class="col-sm-2 col-form-label">医生职称：</label>
              <div class="col-sm-6">
                <select class="form-control" name="jname3" id="jid3">
                  <option value="" disabled selected>请选择</option>
                  <option value="1">住院医生</option>
                </select>
              </div>
            </div>
            <div class="form-group row">
              <label for="dphoto3" class="col-sm-2 col-form-label">头像：</label>
              <div class="col-sm-6">
                <input type="file" class="form-control" name="dphoto3" id="dphoto3" />
              </div>
              <div class="col-sm-4">
                <small id="dphotos3help" class="form-text text-muted">选择图片，添加头像</small>
              </div>
            </div>
            <div class="form-group row">
              <label for="" class="col-sm-2 col-form-label"></label>
              <div class="col-sm-6">
                <img class="userphoto_3" src="./../img/userdefault.jpeg" alt="">
              </div>
            </div>
          </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-secondary" data-dismiss="modal">返回</button>
          <button type="button" class="btn btn-primary btn-add-3">保存</button>
        </div>
      </div>
    </div>
  </div>

</body>
<script src="./../jquery/jquery 3.6.4.js"></script>
<script src="./../bootstrap/js/bootstrap.bundle.js"></script>

<script src="./../js/doctors.js"></script>

</html>